<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head>
    <meta charset="UTF-8">
    <meta name="description" content="Ashion Template">
    <meta name="keywords" content="Ashion, unica, creative, html">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Check Out</title>

    <!-- Css Styles -->
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/font-awesome.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/elegant-icons.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/jquery-ui.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/magnific-popup.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/owl.carousel.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/slicknav.min.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/style-1.css}" type="text/css">

    <link rel="stylesheet" th:href="@{/css/common.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/style-city.css}" type="text/css">
</head>

<body>
    <!-- Page Preloder -->
    <div th:replace="~{comm/common::preloader}"/>

    <!-- Offcanvas Menu Begin -->
    <div class="offcanvas-menu-overlay"></div>
    <div th:replace="~{comm/common::offcanvas}"/>
    <!-- Offcanvas Menu End -->

    <!-- Header Section Begin -->
    <header th:replace="~{comm/common::header}"/>
    <!-- Header Section End -->

    <!-- Breadcrumb Begin -->
    <div th:replace="~{comm/common::breadcrumb}"/>
    <!-- Breadcrumb End -->

    
    <!-- Checkout Section Begin -->
    <section class="checkout spad">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <h6 class="coupon__link"><span class="icon_tag_alt"></span> <a href="#">Have a coupon?</a> Click
                    here to enter your code.</h6>
                </div>
            </div>

            <div action="#" class="checkout__form">
<!--            <form action="#" class="checkout__form">-->
                <div class="row">
                    <div class="col-lg-8">
                        <h5>Billing detail</h5>
                        <div class="row">
                            <div class="col-lg-6 col-md-6 col-sm-6">
                                <div style="display:none;">
                                    <input id="user-id" name="user_id" th:text="${session.user.id}"/></div>
                                <div class="checkout__form__input">
                                    <p>姓名 <span>*</span></p>
                                    <input id="in-name" type="text" name="buyer_name" onclick="console.log($(this).val())" value="默认顾客">
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-6">
                                <div class="checkout__form__input">
                                    <p>电话 <span>*</span></p>
                                    <input id="in-phone" type="text" name="phone"onclick="console.log($(this).val())" value="13600000000">
                                </div>
                            </div>
                            <div class="col-lg-12">
                                <div class="checkout__form__input">
<!--                                    <p>地址 <span style="color:#ff0000;">*</span></p>-->
                                    <p>地址 <span>*</span></p>
                                </div>
                                    <br/>
                                    <p>使用保存的地址?&nbsp;&nbsp;
                                        <input type="checkbox" id="useSavedAddress">
                                    </p>
                                <br/>
                            </div>
                            <th:block th:if="${address!=null}">
                            <br/>
                            <div class="col-lg-12 address-user citys mb20">
                                <select class="city-select" id="in-address">
                                    <option
                                            th:each="addr:${address}"
                                            th:value="${addr.addressId}"
                                            th:text="${addr.streetName}"
                                            th:selected="${addr.isDefault==true}">
                                    </option>
                                </select>
                            </div>
                            <br/>
                            </th:block>
                            <br/>
                            <div class="col-lg-12 address-new">
                                <div class="checkout__form__input">
                                    <p>使用新地址: <span></span></p>
                                    <!--<input type="text" placeholder="Street Address">-->
                                    <!--<input type="text" placeholder="Apartment. suite, unite ect ( optinal )">-->
                                    <div class="citys mb20" id="address_p">
                                        <select class="city-select" name="province" id="addr-province"></select>
                                        <select class="city-select" name="city" id="addr-city"></select>
                                        <select class="city-select" name="area" id="addr-area"></select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-12 address-new">
                                <div class="checkout__form__input">
                                    <p>完善新地址 <span>*</span></p>
                                    <input type="text" id="addr-detail">
                                </div>
                                <label for="save-addr" style="float: right">
                                    设为默认地址
                                    <input type="checkbox" id="is-default">
                                    <span class="checkmark"></span>
                                    <!--ajax 提交之后加个p标签返回状态-->
                                    <span class="btn btn-sm btn-dark" id="save-addr">保存新地址</span>
                                </label>
                            </div>
                            <div class="col-lg-12">
                                <div class="checkout__form__input">
                                    <p>留言 </p>
                                    <input type="text" id="in-msg">
                                </div>
                            </div>
                        </div>
                    </div>
                        <div class="col-lg-4">
                            <div class="checkout__order">
                                <h5>订单详情</h5>
                                <div class="checkout__order__product">
                                    <ul>
                                        <li>
                                            <span class="top__text">商品</span>
<!--                                            <span class="top__text">商品</span>-->
                                            <span class="top__text__right">数量</span>
                                        </li>
                                        <div style="display: inline">
                                        <th:block th:if="${cart!=null}" th:each="cartEntry:${cart}">
                                            <li th:text="|${cartEntry.key.name} --- ${cartEntry.value}|" ></li>
                                            <li class="itemType" th:value="${cartEntry.key.type}" hidden="hidden"></li>
                                            <span class="priceSell" th:utext="|￥ ${cartEntry.key.priceSell} |"
                                                  style="color:#ff0033;"></span>&nbsp;&nbsp;&nbsp;
                                            <span class="memberPriceSell" th:utext="|会员价:￥ ${cartEntry.key.type==2?cartEntry.key.priceSell*0.9:cartEntry.key.priceSell} <br/>|"
                                                  style="color:#0704af;"></span>
                                            <input class="itemNum" type="hidden" th:value="${cartEntry.value}">
                                            <br/>
                                        </th:block>
                                        </div>
                                    </ul>
                                </div>
                                <div class="checkout__order__total">
                                    <ul>
                                        <li>原价 <span id="in-payment">750.0</span></li>
                                        <li>会员价 <span id="member-payment">750.0</span></li>
                                        <input class="member1" id="in-member2" type="hidden" th:value="${member}">
                                        <li><span id="in-member"></span></li>
                                    </ul>
                                </div>
                                <div class="checkout__order__widget">
                                    <label for="check-payment">
                                        货到付款
                                        <input type="radio" id="check-payment" checked="checked" name="check">
                                        <span class="checkmark" ></span>
                                    </label>
                                    <label for="online">
                                        在线支付
                                        <input type="radio" id="online"name="check">
                                        <span class="checkmark" ></span>
                                    </label>
                                </div>
                                <span class="btn btn-group-toggle site-btn" id="fin-submit" onclick="checkAddress()">提交订单</span>
                            </div>
                        </div>
                </div>
            </div>
        </div>
    </section>
        <!-- Checkout Section End -->

        <!-- Instagram Begin -->
        <div th:replace="~{comm/common::ins}"/>
        <!-- Instagram End -->

        <!-- Footer Section Begin -->
        <footer th:replace="~{comm/common::footer}"/>
        <!-- Footer Section End -->

        <!-- Search Begin -->
        <div th:replace="~{comm/common::search}"/>
        <!-- Search End -->

        <!-- Js Plugins -->
        <script th:src="@{/js/jquery-3.3.1.min.js}"></script>
        <script th:src="@{/js/bootstrap.min.js}"></script>
        <script th:src="@{/js/jquery.magnific-popup.min.js}"></script>
        <script th:src="@{/js/jquery-ui.min.js}"></script>
        <script th:src="@{/js/mixitup.min.js}"></script>
        <script th:src="@{/js/jquery.countdown.min.js}"></script>
        <script th:src="@{/js/jquery.slicknav.js}"></script>
        <script th:src="@{/js/owl.carousel.min.js}"></script>
        <script th:src="@{/js/jquery.nicescroll.min.js}"></script>
        <script th:src="@{/js/main-1.js}"></script>
<!--        <script th:src="@{/js/jquery-1.11.3.js}"></script>-->
        <script th:src="@{/js/jquery-citys.js}"></script>
        <script th:src="@{/js/handle/checkout.js}"></script>
    <script>
        $(document).ready(function(){
            let res = 0
            $.ajax({
                type:'get',
                url:"/cart/checkAmount",
                async:false,
                success:function(result){
                    console.log(result)
                    res = result
                    $('#cartNum').text(res)
                }});
        })
    </script>
    </body>
    </html>
